<template>
    <div class="identity-main-layout">
        <div v-if="isShowPeopleInfo===true">
            <div class="identity-info-part">
                <img :src="qn_domain+idPhotoUrl"
                     class="img-logo"
                     style="border-radius: 0.5rem;"
                     alt="">
                <div class="left-sp" style="text-align: left;">
                    <p style="font-size: 1.2em">{{name}}</p>
                    <p class="french-grey-color" v-if="phone!==null">{{phone}}</p>
                    <p class="french-grey-color" v-if="cardNo!==null">{{cardNo}}</p>
                    <p class="french-grey-color">{{serviceName}}</p>
                </div>
            </div>

            <div v-show="false" class="identity-task-part">
                <p style="text-align: left" class="french-grey-color">我报修的</p>
                <div class="identity-content-part" v-for="(item,index) in list">
                    <p>MT32021703310004</p>
                    <p class="blue-color">允许入场</p>
                </div>
            </div>

            <div v-show="false" class="identity-task-part">
                <p style="text-align: left" class="french-grey-color">同事发起的</p>
                <div class="identity-content-part" v-for="(item,index) in list">
                    <p>MT32021703310004</p>
                    <p class="blue-color">允许入场</p>
                </div>
            </div>
        </div>
        <div v-else>
            <img src="../../assets/task_none_task_icon.png" class="nolist-image" alt="">
            <p  class="nolist-tite">没有运维人员信息</p>
        </div>
    </div>
</template>

<script>
import {checkQrCode} from "../../pcof/post";
import {userInfoData,qn_domain} from '../../globalVariables';
    export default {
        name: "identityAuthentication",
        data() {
            return {
                list: 2,
                identity: '',
                qn_domain: '',
                qrCode:'',
                name: '',
                idPhotoUrl:'',
                serviceName: '',
                phone: '',
                cardNo: '',
                isShowPeopleInfo: true,
            }
        },
        created() {
            this.qn_domain = localStorage.getItem(qn_domain);
            this.identity = this.$route.params.identity;
            this.checkQrCodeFunc();
        },
        beforeCreate() {
            this.$dialog.loading.open('加载中...');
        },
        methods: {
            async checkQrCodeFunc() {

                var response = await checkQrCode(
                    JSON.parse(localStorage.getItem(userInfoData)).mobile,
                    this.identity
                );
                this.$dialog.loading.open('加载中...');
                if (response.data.code === 200) {
                    this.$dialog.loading.close();
                    this.isShowPeopleInfo = true;
                    this.qrCode = response.data.data.qrCode;
                    this.name = response.data.data.name;
                    this.idPhotoUrl = response.data.data.idPhotoUrl;
                    this.serviceName = response.data.data.serviceName;
                    this.phone = response.data.data.mobile;
                    this.cardNo = response.data.data.cardNo;
                    // this.$dialog.confirm({
                    //     title: '选填标题',
                    //     mes: response.data.data,
                    //     opts: () => {
                    //         this.$dialog.toast({mes: '你点了确定', timeout: 1000});
                    //     }
                    // });
                } else {
                    this.$dialog.loading.close();
                    this.isShowPeopleInfo = false;
                    this.$dialog.toast({
                        mes: response.data.msg,
                        timeout: 1500
                    });
                }
            },
        }
    }
</script>

<style lang="scss">
    .identity-main-layout {


        .identity-info-part {
            display: flex;
            align-items: center;
            padding-left: 0.3rem;
            padding-right: 0.3rem;
            padding-bottom: 0.1rem;

            .identity-logo-part {
                border-radius: 0.5rem;
                width: 2rem;
                height: 1.6rem;
                object-fit: cover;
                padding-bottom: 0.1rem;
            }
        }

        .identity-task-part {
            padding-left: 0.3rem;
            padding-top: 0.4rem;

            .identity-content-part {
                display: flex;
                justify-content: space-between;
                padding-right: 0.3rem;
                padding-top: 0.1rem;
                padding-bottom: 0.1rem;
                font-size: 1.2em;
            }
        }
    }
</style>